<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <title>省市联动</title>
    <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
    <script type="text/javascript">
        var provinceArr = new Array(5);
        provinceArr[0] = new Array("北京市");
        provinceArr[1] = new Array("郑州市","洛阳市","濮阳市","驻马店市");
        provinceArr[2] = new Array("石家庄市","唐山","秦皇岛","邯郸");
        provinceArr[3] = new Array("西安市","宝鸡市","延安");
        provinceArr[4] = new Array("菏泽市","济南市","青岛");

        $(function(){
            $("#province").change(function(){
                $("#city").empty();
                var provinceID = this.value;
                console.log(provinceID);
                if(provinceID == -1){
                    $("#city").html("<option value='-1'>-请选择-</option>");
                }else{
                    for(var i=0;i<provinceArr[provinceID].length;i++){
                        var option = document.createElement("option");
                        option.innerText = provinceArr[provinceID][i];
                        $("#city").append(option);
                    }
                }
            });
        });
    </script>
</head>
<body>
    <select id="province">
        <option value="-1">-请选择-</option>
        <option value="0">北京市</option>
        <option value="1">河南省</option>
        <option value="2">河北省</option>
        <option value="3">陕西省</option>
        <option value="4">山东省</option>
    </select>
    <select id="city">
        <option value="-1">-请选择-</option>
    </select>
</body>
</html>